<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"  xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight">
		<div class="col-sm-12">
			<div class="ibox">
				<div class="ibox-body">
					<div class="fixed-table-toolbar">
						<div class="columns pull-right" role="group">
							<button class="btn btn-success" onclick="reLoad()">
								<i class="fa fa-search" aria-hidden="true"></i>查询
							</button>
						</div>

						<div class="pull-right search col-md-1 nopadding">
							<input id="title" type="text" class="form-control" placeholder="活动主题">
						</div>
					</div>
					<table id="table" data-mobile-responsive="true"></table>
				</div>
			</div>
		</div>
	</div>
	<div th:include="include :: footer"></div>
	<script type="text/javascript" >
		var prefix = "/businesscard/manage";

		$(function () {
			load();
		});
		$('#table').on('load-success.bs.table', function (e, data) {
			if (data.total && !data.rows.length) {
				$('#table').bootstrapTable('selectPage').bootstrapTable('refresh');
			}
		});

		function load() {
			$('#table').bootstrapTable(
					{
						method: 'get', // 服务器数据的请求方式 get or post
						url: prefix + "/commissionList", // 服务器数据的加载地址
						showRefresh: true,
						// showToggle : true,
						iconSize: 'outline',
						// toolbar: '#exampleToolbar',
						striped: true, // 设置为true会有隔行变色效果
						dataType: "json", // 服务器返回的数据类型
						pagination: true, // 设置为true会在底部显示分页条
						pageList: [10, 20, 50],
						// queryParamsType : "limit",
						// //设置为limit则会发送符合RESTFull格式的参数
						singleSelect: true, // 设置为true将禁止多选
						// contentType : "application/x-www-form-urlencoded",
						// //发送到服务器的数据编码类型
						pageSize: 10, // 如果设置了分页，每页数据条数
						pageNumber: 1, // 如果设置了分布，首页页码
						// search : true, // 是否显示搜索框
						showColumns: true, // 是否显示内容下拉框（选择显示的列）
						sidePagination: "server", // 设置在哪里进行分页，可选值为"client" 或者
						// "server"
						queryParams: function (params) {
							return {
								limit: params.limit,
								offset: params.offset,
								order: 'desc',
								title: $.trim($('#title').val())
							};
						},
						columns: [
							{
								title: '序号',// 列标题
								formatter: function (value, row, index) {
									var pageSize = $('#table').bootstrapTable('getOptions').pageSize;//通过表的#id 可以得到每页多少条
									var pageNumber = $('#table').bootstrapTable('getOptions').pageNumber;//通过表的#id 可以得到当前第几页
									return pageSize * (pageNumber - 1) + index + 1;
								}
							},
							{
								field: 'realname',
								title: '会员名称'
							},
							{
								field: 'type',
								title: '佣金类型',
								formatter: function (value, row, index) {
									if (value == 1) {
										return "推荐佣金";
									} else if (value == 2) {
										return "团队管理佣金";
									}else if (value == 40) {
                                        return "代理商佣金";
                                    }
								}
							},
							{
								field: 'commission',
								title: '佣金'
							},
							{
								field: 'createTime',
								title: '时间'
							}]
					});
		}

		function reLoad() {
			$('#table').bootstrapTable('refresh');
		}

	</script>
</body>
</html>